import React from 'react';
import { Button, message, Menu, Dropdown } from 'antd';
import { WeaLocaleProvider,WeaTable,WeaDialog} from 'ecCom';
import { inject, observer } from 'mobx-react';
import ProgramScore from "./ProgramScore";
const toJS = mobx.toJS;
const getLabel = WeaLocaleProvider.getLabel;

/**
 * 考核评分人展示组件
 */
@inject("programItemStore")
@observer
export default class ProgramScoreDetail extends React.Component {

    constructor(props) {
        super(props);
        this.state = {
            _disabled: true,//删除按钮是否可点
            selectedRowKeys:[],//table复选框index
            selectedRows:[],//table复选框选中值
            showdetail:false,//评分人dialog显隐
            datalist:[],//整合后评分人table信息
            scoreTableList:[],//新增和编辑评分人table data
            scoreattr:"0",//新增和编辑评分人下拉框值
            scoreTableids:"",///编辑评分人页面id值
        }
    }
    componentWillReceiveProps(newProps){
        const{detailList,programItemStore} = newProps;
        this.setState({datalist:programItemStore.getNewAccessDate(detailList),_disabled:true,showdetail:false,selectedRowKeys:[],selectedRowKeys:[]});
    }
    onMenuClick(key,record){//打开评分人页面
        if(key==3){
            this.setState({showdetail:true,scoreTableList:[],scoreattr:"0",scoreTableids:""});
            return;
        }
        let currentid = record.showid;
        if(currentid==""|| currentid==","){
            message.warning(getLabel(501159, '请选择要操作的数据'));
            return false;
        }
        if(key==1){
            const {detailList} = this.props;
            let _showidArray = currentid.split(",");
            let editdetailList = [];
            for(let i=0;i<_showidArray.length;i++){
                if(_showidArray[i]!=""){
                    editdetailList = editdetailList.concat(detailList.filter((d, j) => d.checkuserid == _showidArray[i]))
                }
            }
            this.setState({scoreTableList:editdetailList,showdetail:true,scoreattr:record.showattr,scoreTableids:currentid});
        }else if(key==2){//单个删除
            const {datalist} = this.state;
            let newDatas = [];
            newDatas = datalist.filter((d,j)=>d.showid != currentid);
            this.onCallBack(newDatas);
        }
    }
    setShowDetail(v){//设置dialog显隐
        this.setState({showdetail:v});
    }
    onSelectChange = (selectedRowKeys,selectedRows) => {//table复选框变化
        this.setState({selectedRowKeys:selectedRowKeys,selectedRows:selectedRows,_disabled:selectedRowKeys.length>0?false:true});
    }
    delData(){//批量删除操作
        let{selectedRows,datalist} = this.state;
        if(selectedRows && selectedRows.length>0){
            let newDatas = datalist;
            for(let i=0;i<selectedRows.length;i++){
                newDatas = newDatas.filter((d,j)=>d.showid != selectedRows[i].showid);
            }
            this.onCallBack(newDatas);
        }
    }
    onScoreTableChange =(datas,key)=>{//评分人页面回调方法
        if(key==1){
            this.setState({scoreattr:datas});
        }else{
            this.setState({scoreTableList:datas});
        }
    }
    onSureDetail(){
        const {scoreTableList,scoreattr,scoreTableids} = this.state;
        if(scoreTableList.length>0){
            if(scoreTableList.some(item => item.checkuserid == undefined || item.checkuserid === '')){
                message.warning(getLabel('509119', '评分人不能为空！'));
                return false;
            }
            if(scoreTableList.some(item => item.rate == undefined || item.rate === '')){
                message.warning(getLabel('518946', '权重不能为空！'));
                return false;
            }
            const {detailList,programItemStore:{currentorder}} = this.props;
            if(scoreTableList.some(item => detailList.find(element => scoreTableids.indexOf(","+item.checkuserid+",")==-1 && element.checkuserid == item.checkuserid))){
                message.info(getLabel('509118', '评分人已存在!'));
                return false;
            }
            
            scoreTableList.forEach(item =>{
                item.scoreattr = scoreattr;
                item.newexeorder = parseInt(currentorder)+1;
            })
            this.onCallBack(scoreTableList,1);
        }
    }
    onCallBack(datas,key){
        const{onDataChange,detailList} = this.props;
        let newdetailList = [];
        if(key==1){//新增和编辑
            const{scoreTableids} = this.state;
            if(scoreTableids!=""){//编辑
                let _index = -1;
                detailList.map((element,idx)=>{
                    if(scoreTableids.indexOf(","+element.checkuserid+",")>-1){
                        if(_index==-1){
                            _index = idx;
                            newdetailList = newdetailList.concat(datas);
                        }
                    }else{
                        newdetailList.push(element);
                    }
                });
            }else{
                newdetailList = detailList.concat(datas);
            }
        }else{//删除 拖动
            datas && datas.length>0 && datas.map((element,idx)=>{
                let _showid = element.showid;
                let _showidArray = _showid.split(",");
                for(let i=0;i<_showidArray.length;i++){
                    if(_showidArray[i]!=""){
                        newdetailList = newdetailList.concat(detailList.filter((d, j) => d.checkuserid == _showidArray[i]))
                    }
                }
            });
        }
        onDataChange(newdetailList);
    }
    render() {
        const { managerid, backSetting, managername, detailList, onDataChange, showStatus, isFromList } = this.props;
        const { selectedRowKeys, _disabled,showdetail,datalist,scoreTableList,scoreattr} = this.state;
        const columns = [
            { title: getLabel('508672', '评分人'), dataIndex: 'showid', width: '60%',
                render: (text, record, index) =>
                    <div>
                        {
                            detailList && detailList.length > 0 && detailList.map((element, idx) => {
                                if (text!=undefined && text!="" && text.indexOf("," + element.checkuserid + ",") > -1) {
                                    return <span className="programscoredetail-showname-span">{element.checkusername + "(" + element.rate + "%)"}
                                              {element.templateid && <span>-{element.templatename}</span>}
                                           </span>
                                }
                            })
                        }
                    </div>
            },
            { title: getLabel(125351, '会签属性'), dataIndex: 'showattr', width: '30%',render:(text, record, index)=>{
                if(text==0){
                    return getLabel(15558, '依次逐个处理');
                }
                return getLabel(15557, '会签');
            }},
            { title:"", dataIndex: 'showid', width: '5%',
            render: (text, record, index)=>{
                return showStatus && <div className="programscoredetail-col"><Dropdown ecId={`${this && this.props && this.props.ecId || ''}_Dropdown@ovke4i@operate${index}`} overlay={
                    <Menu ecId={`${this && this.props && this.props.ecId || ''}_Menu@lqx6nn@${index}`} onClick={(e)=>{this.onMenuClick(e.key,record)}}>
                        <Menu.Item ecId={`${this && this.props && this.props.ecId || ''}_Menu.Item@fyyw5j@${index}`} className="programscoredetail-col-menu-item" key="1" >{getLabel(93, '编辑')}</Menu.Item>
                        <Menu.Item ecId={`${this && this.props && this.props.ecId || ''}_Menu.Item@huf35t@${index}`} className="programscoredetail-col-menu-item" key="2" >{getLabel(91, '删除')}</Menu.Item>
                    </Menu>
                }>
                    <i className='icon-coms-more' style={{fontSize:"20px"}}></i>
                </Dropdown></div>
            }}
        ];
        return <div className="wea-workrelate-performance-programscoredetail">
            {showStatus && <div className="programscoredetail-title-div"><div className="programscoredetail-title-div-button">
                <Button ecId={`${this && this.props && this.props.ecId || ''}_Button@8f4q1z`} type="primary" className="programscoredetail-button" title={getLabel(611, '添加')} onClick={() => {this.onMenuClick(3)}}><span className="icon-coms-Add-to-hot"></span></Button>
                <Button ecId={`${this && this.props && this.props.ecId || ''}_Button@0i6w8a`} type="primary" className="programscoredetail-button" disabled={_disabled} title={getLabel(91, '删除')} onClick={() =>this.delData()}><span className="icon-coms-form-delete-hot"></span></Button>
            </div></div>}
            <WeaTable ecId={`${this && this.props && this.props.ecId || ''}_WeaTable@6w92d4`} columns={columns} bordered={false} dataSource={datalist} draggable={showStatus ? true : false} onDrop={(datas)=>this.onCallBack(datas)}
                rowSelection={showStatus?{
                    selectedRowKeys: selectedRowKeys,
                    onChange: this.onSelectChange,
                }:false} pagination={false} />
            <WeaDialog ecId={`${this && this.props && this.props.ecId || ''}_WeaDialog@aiarum`}
                icon='icon-coms-implement'
                iconBgcolor='rgb(150, 53, 138)'
                style={{width: window.innerWidth * 0.8, height: window.innerHeight * 0.6}}
                title={getLabel('15489', '考核评分')}
                buttons={[<Button ecId={`${this && this.props && this.props.ecId || ''}_Button@u452ko@sure`} type="primary" onClick={() => this.onSureDetail(false)}>{getLabel(826, '确定')}</Button>,
                <Button ecId={`${this && this.props && this.props.ecId || ''}_Button@vfhveu@close`} type="ghost" onClick={() => this.setShowDetail(false)}>{getLabel(309, '关闭')}</Button>]}
                hasScroll
                visible={showdetail}
                onCancel={() => this.setShowDetail(false)}>
                <ProgramScore ecId={`${this && this.props && this.props.ecId || ''}_ProgramScore@za4pzw`}
                    detailList={scoreTableList}
                    onDataChange={(datas,key)=>this.onScoreTableChange(datas,key)}
                    showStatus={showStatus}
                    managerid={managerid}
                    managername={managername}
                    isFromList={isFromList}
                    backSetting={backSetting}
                    scoreattr={scoreattr}
                />
            </WeaDialog>
        </div>
    }
};